import classes from './index.module.less';

import { useState } from 'react';
import { Button, message } from 'antd';
import { useNavigate } from 'react-router-dom';

import { login } from '@/api/system';
import userStore from '@/stores/user';

const Login = () => {
  const navigate = useNavigate();
  const setUser = userStore(state => state.setUser);
  const [loading, setLoading] = useState(false);

  const onLogin = async () => {
    try {
      setLoading(true);
      const { data } = await login({ username: 'wind', password: '123' });
      setLoading(false);
      const { token, userInfo } = data;
      setUser(token, userInfo);
      message.success('登录成功');
      navigate('/');
    } catch (error) {
      setLoading(false);
    }
  };

  return (
    <div className={classes.container}>
      <div className={classes.title}>产线排样图三维交互平台</div>
      <Button type="primary" className={classes.button} loading={loading} onClick={onLogin}>
        登录
      </Button>
    </div>
  );
};

export default Login;
